import CommonInputNumber from "@/pages/OrderModule/common/components/CommonInputNumber";
import SubTitle from "@/pages/OrderModule/common/components/SubTitle";
import Typography from "@/pages/OrderModule/common/components/Typography";
import { Alert, Space, Switch, Button, message } from "antd";
import { useState } from "react";

const FreightInterception = ({ data, handUpDateBaseConfigData }) => {
	//运费自动拦截                  //	拦截最低运费
	const { autoFreightInterceptor, interceptMinFreight } = data;

	const [showValue, setShowValue] = useState(interceptMinFreight); //运费展示

	const renderAlertMsg = () => {
		return (
			<div>
				<div>
					1、开启快递运费拦截后，如果快递运费差价超过预估运费的设定值后，订单称重发货时会自动拦截，并且标记“运费拦截”的图标；
				</div>
				<div>2、只针对所有代发订单；其他订单，不进行拦截，用户自行处理；</div>
				<div>3、拦截后，需要用户在订单处理——待发货或已取件状态里注意查看，可联系仓库换快递。</div>
			</div>
		);
	};

	//开关切换
	const handleSwitch = e => {
		handUpDateBaseConfigData({
			autoFreightInterceptor: e ? 1 : 0
		});
	};

	//运费修改
	const freightChange = e => {
		setShowValue(e.target.value);
	};

	//点击保存
	const handleSave = () => {
		if (showValue) {
			handUpDateBaseConfigData({
				interceptMinFreight: showValue
			});
		} else {
			message.info("金额不能为空");
		}
	};

	const renderTitle = () => {
		return (
			<SubTitle
				title={
					<>
						是否开启快递运费自动拦截：
						<Switch
							checkedChildren="已开启"
							unCheckedChildren="已关闭"
							checked={autoFreightInterceptor}
							onClick={e => handleSwitch(e)}
							size="default"
						/>
					</>
				}
				symbol
				as="s2"
			/>
		);
	};

	return (
		<Space direction="vertical" size={20}>
			<SubTitle title="信息详情" as="s2" />
			<Alert message={renderAlertMsg()} type="info" showIcon />
			{renderTitle()}
			<Space direction="horizontal">
				<Typography type="error">*</Typography>订单的实际运费大于等于预估运费：
				<CommonInputNumber
					max={999999}
					precision="2"
					setp={0.01}
					placeholder="请输入金额"
					onBlur={freightChange}
					value={showValue}
				></CommonInputNumber>
				元时，发货会拦截
			</Space>
			<div>
				<Button onClick={handleSave} type="primary">
					保存
				</Button>
			</div>
		</Space>
	);
};
export default FreightInterception;
